﻿@{
    ViewBag.Title = "HomePage";
    Layout = "~/Views/Shared/_LayoutPublic.cshtml";
}
@section Javascript
{  
    <link href="@Url.Content("../../Styles/Playlist/popbox.css")" rel="stylesheet" type="text/css" />  
    <link href="../../Styles/HomePage.css" rel="stylesheet" type="text/css" />
    <link href="../../Styles/Banner/style2.css" rel="stylesheet" type="text/css" />
    <script src="../../Scripts/Banner/jquery.easing.js" type="text/javascript"></script>
    <script src="../../Scripts/Banner/script.js" type="text/javascript"></script> 
    <script src="../../Scripts/Playlist/popbox.js" type="text/javascript"></script>
}
    <script type="text/javascript">
        $(document).ready(function () {
            var buttons = { previous: $('#jslidernews2 .button-previous'),
                next: $('#jslidernews2 .button-next')
            };
            $('#jslidernews2').lofJSidernews({ interval: 5000,
                easing: 'easeInOutQuad',
                duration: 1200,
                auto: true,
                mainWidth: 598,
                mainHeight: 180,
                navigatorHeight: 85,
                navigatorWidth: 310,
                maxItemDisplay: 3,
                buttons: buttons
            });
        });
</script>
<script type="text/javascript">
    $(document).ready(function () {
        $('.popbox').popbox(); 
        $("a.tab").click(function () {
            $(".active").removeClass("active");
            $(this).addClass("active");
            $(".content").slideUp();
            var content_show = $(this).attr("title");
            $("#" + content_show).slideDown();
        });
    });
</script>
<script type="text/javascript">
    function getID(id) {            
            var playlistname = document.getElementById(id).value;            
            $.ajax({
                url: '/playlist/addplaylist',
                dataType: 'json',
                type: "post",
                data: ({ 'playlistname': playlistname }),
                success: function (result) {
                    location.reload();
                }
            });
    }
  
    </script>
    <script type="text/javascript">
        function addMusic(songid) {
            var plid = document.getElementById("cbx-playlist-name").value;
            if (plid != "") {
                var ans = window.confirm("Bạn chắc chắn muốn thêm bài hát này vào danh sách?");
                if (ans) {
                    $.ajax({
                        url: '/playlist/addmusic',
                        dataType: 'json',
                        type: 'post',
                        data: ({ 'songid': songid, 'plid': plid }),
                        success: function (result) {
                            location.reload();
                        }
                    });
                }
            }
        }
    </script>
 
  <div id="wrapper">
     <div id="left-menu">                                                  
            <div id="category-music">
                <h4 class="category">Thể Loại</h4>
                <ul>
                    @foreach (ListenMusic.Category_ServiceReference.Category c in ViewBag.allCategory)
                    {
                        <li><a href="song/searchsong_bycategory?pageindex=1&categoryid=@c.CategoryID">@c.CategoryName</a></li>
                    }                               
                </ul>
            </div>

            <div id="singer-vietnam">
                @foreach (ListenMusic.Models.ViewModel.CountrySinger c in ViewBag.allSinger)
                { 
                     <h4 class="category">@c.CountryName</h4>
                    <ul>                        
                         @for (int i = 0; i < @c.singer.Count; i++)
                         {
                           <li><a href="/search/Search_bySingerName?pageindex=1&option=song&singerName=@c.singer[i].SingerName">@c.singer[i].SingerName</a></li>
                         }                    
                    </ul>
                }               
            </div>
        </div> 
    <div id="middle-content">
       <div id="banner">
                <div id="jslidernews2" class="lof-slidecontent" style="width:598px; height:255px;">
	        <div class="preload"><div></div></div>
            <div  class="button-previous">Previous</div>
    		 <!-- MAIN CONTENT --> 
              <div class="main-slider-content" style="width:430px; height:255px;">
                <ul class="sliders-wrap-inner">
                    @foreach (ListenMusic.Album_ServiceReference.AlbumSinger a in ViewBag.banner)
                    {
                    <li>                       
                          <a href="listen/ListenAlbumPage?albumid=@a.AlbumID"><img src="../../Images/albums/@a.Picture" alt="@a.AlbumName" width="383px" height="255px" title="@a.AlbumName" /></a>           
                          <div class="slider-description">
                            <h4>@a.AlbumName</h4>
                            <p>@a.SingerName</p>                                                     
                         </div>
                    </li> 
                    }
                  </ul>  	
            </div>
 		   <!-- END MAIN CONTENT --> 
           <!-- NAVIGATOR -->
           	<div class="navigator-content">
                  <div class="navigator-wrapper">
                        <ul class="navigator-wrap-inner">
                        @foreach (ListenMusic.Album_ServiceReference.AlbumSinger a in ViewBag.banner)
                        {
                            <li>
                                <div>
                                    <img src="../../Images/albums/@a.Picture" width="70px" height="25px" alt="@a.AlbumName" />
                                    <h3>@a.AlbumName</h3>
                                    <p>@a.SingerName</p>
                                </div>    
                            </li>
                        }     	
                        </ul>
                  </div>
             </div> 
          <!----------------- END OF NAVIGATOR --------------------->
          <div class="button-next">Next</div>
 
 		 <!-- BUTTON PLAY-STOP -->
          <div class="button-control"><span></span></div>
          <!-- END OF BUTTON PLAY-STOP -->
           
 </div> 
            </div>              
             <h4 class="category">Album Nổi Bật</h4>  
                <div class="content-home">                   
                    <div class="dl-album-video">                        
                         <ul>
                            @foreach (ListenMusic.Album_ServiceReference.View8_Random_Album a in ViewBag.newAlbum)
                            {
                              <li>
                                <a href="listen/ListenAlbumPage?albumid=@a.AlbumID"><img src="../Images/albums/@a.Picture" alt="@a.AlbumName" width="139" height="150" /></a>
                             </li>
                            }
                        </ul>
                    </div>                    
                </div>
                <h4 class="category">Video Nổi Bật</h4>        
                <div class="content-home">
                        <ul>
                            @foreach (ListenMusic.Video_ServiceReference.View12_Random_Video ss in ViewBag.newVideo)
                            { 
                                <li>
                                    <a href="listen/ViewVideos?pageindex=1&videoid=@ss.SongID">@ss.SongName</a>
                                </li>
                            }
                        </ul>
                </div> 
                <h4 class="category">Bài Hát Nổi Bật</h4>
                 <div class="content-home">   
                    <div id="ms-content">
                    <ul>
                        @foreach (ListenMusic.Song_ServiceReference.View20_Random_BaiBat ns in ViewBag.newSong)
                        {                           
                            
                            <li>
                                @Html.ActionLink(@ns.SongName, "ListenPage", "Listen", new { songid = @ns.SongID, pageindex = 1 }, new { })  <br />
                                <span class="sub-detail">
                                    Trình bày: <a class="singer" href="/search/Search_bySingerName?pageindex=1&option=song&singerName=@ns.SingerName">@ns.SingerName</a> | Lượt nghe: @ns.CountView
                                </span>
                                  <div class='popbox'>
                                   @if (Session["user"] == null)
                                   { 
                                       
                                            <a href="#login-box" class="login-window" title="Thêm vào danh sách yêu thích">
                                                <img src='../../Images/Icons/add.png' alt="" width="14px" title="Thêm vào danh sách yêu thích" style='position:relative' />
                                            </a>
                                   }
                                   else
                                   {
                                       bool flag = true;
                                       foreach (ListenMusic.Playlist_ServiceReference.FavoritePlayList fl in ViewBag.songInPlaylist)
                                       {

                                           if (ns.SongID.Equals(fl.SongID))
                                           {   
                                                <img src='../../Images/Icons/check.png' alt="" style='width:14px;position:relative' />                                          
                                               flag = false;
                                               break;
                                           }

                                       }
                                       if (flag == true)
                                       {                                       
                                            <a href="#open" class='open' rel="shareit" name="@ns.SongID" title="Thêm vào danh sách yêu thích">
                                                <img src='../../Images/Icons/add.png' alt="" title="Thêm vào danh sách yêu thích" style='width:14px;position:relative' />
                                            </a>           
                                       }
                                   }
                                <a href="@Url.Action("dowloadfile", "dowload", new { url = ns.SongURL })"><img src="../../Images/Icons/download.jpg" title="Tải bài hát về máy" width="16" height="16px" alt="" /></a>                           
                              <div class='collapse'>
                                  <div class='box'>
                                    <div class='arrow'></div>
                                    <div class='arrow-border'></div>
                                    <form action="" method="post" id="subForm">
                                        <div style="margin-left:20px; margin-top:10px">
                                            <select id="cbx-playlist-name" name="cbx-playlist-name" onchange="addMusic(@ns.SongID)">
                                                <option value="">-Chọn-</option>
                                                    @if (@Session["user"] != null)
                                                    {
                                                        foreach (ListenMusic.Playlist_ServiceReference.Playlist pl in ViewBag.playlist)
                                                        {
			                                                <option value='@pl.PlaylistID'>@pl.PlaylistName</option>
                                                        }
                                                    }
                                            </select>
                                        </div>
                                        <div style="margin-left:20px">
                                            <input type="text" id="playlistname-@ns.SongID" name="playlistname" placeholder="Tên của laylist" style="width:90px; margin-top:10px;"/> 
                                            <a href="javascript:getID('playlistname-@ns.SongID')" id="create-playlist" style="font-size:small">Tạo Playlist</a>
                                        </div>
                                      <div style="text-align:center; margin-top:10px"><a href="#" class="close">Cancel</a></div>
                                    </form>
                                  </div>
                                </div>
                        </div>
                
                    </li>                           
                        }     
                </ul> 
                    </div>  
                </div>  
    </div>
    <div id="toprate">
  <h4 class="category">Bảng Xếp Hạng</h4>
    <div class="top-content">
      <div class="tabbed_box_1 tabbed_box">
            <div class="tabbed_area">
             <ul class="tabs">
                        <li><a href="#" title="Song" class="tab active">Bài Hát</a></li>
                        <li><a href="#" title="Video" class="tab">Video</a></li>  
                         <li><a href="#" title="Album" class="tab">Album</a></li>                                      
                    </ul>
            <div style="display: block;" id="Song" class="content">
            <!-- nội dung của Song -->
                <ul>
                    @foreach (ListenMusic.Song_ServiceReference.View_BXH_BaiHat ts in ViewBag.topSong)
                    { 
                     <li><a href="/listen/listenpage?pageindex=1&songid=@ts.SongID">@ts.SongName</a><br /><a href="/search/Search_bySingerName?pageindex=1&option=song&singerName=@ts.SingerName"><small>@ts.SingerName</small></a></li>
                    }                   
                </ul>
            <!-- END nội dung của Song -->
            </div>
            <div style="display: none;" id="Video" class="content">
            <!-- nội dung của Video -->
                <ul>
                  @foreach (ListenMusic.Video_ServiceReference.View_BXH_Video tv in ViewBag.topVideo)
                  { 
                     <li><a href="/listen/viewvideos?pageindex=1&videoid=@tv.SongID">@tv.SongName</a><br /><a href="/search/Search_bySingerName?pageindex=1&option=song&singerName=@tv.SingerName"><small>@tv.SingerName</small></a></li>
                  }                    
                </ul>
            <!-- END nội dung của Video -->
            </div>
            <div style="display: none;" id="Album" class="content">
            <!-- nội dung của Album -->
                <ul>
                    @foreach (ListenMusic.Album_ServiceReference.View_BXH_Album ta in ViewBag.topAlbum)
                    { 
                     <li><a href="/listen/listenalbumpage?albumid=@ta.AlbumID">@ta.AlbumName</a><br /><a href="/search/Search_bySingerName?pageindex=1&option=song&singerName=@ta.SingerName"><small>@ta.SingerName</small></a></li>
                    }                     
                </ul>
            <!-- END nội dung của Album -->
            </div>
        </div>
    </div>
</div>   
 </div>
  </div>
